<template>
	<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">

		<li v-for="item in list" style="height: 100px;">
			
			{{item.title}}
		</li>

	</van-list>
</template>

<script setup>
	import {
		useRoute
	} from 'vue-router';
	import {
		search as searchApi
	} from '@/api/index'
	import {
		ref,
		onMounted
	} from 'vue'
	const route = useRoute()


	const key_word = route.query.key_word

	const list = ref([]); //   放列表数据
	const loading = ref(false); //  是否在加载中... 
	const finished = ref(false); // 是否已完成
	let skip = 0; //   
	let limit = 10;
	const onLoad = () => {
		// skip   其实等于 list的长度
		searchApi({
			skip: list.value.length,
			limit,
			key_word
		}).then(res=>{
			
			
			console.log(res)
			
			if(res.code === 0){
				
				list.value.push(...res.data)
				
				loading.value = false;//  让他不再是加载中的状态  
				
				if (list.value.length >=res.count) {
					finished.value = true;
				}
			}
			
		})


	};
</script>

<style>
</style>